<script>
    import SignalRClient from '@/pages/tools/signalRClient.js';
    const client = new SignalRClient('http://localhost:2303', 'chatHub');
    
    // 注册客户端方法
    client.on('ReceiveMessage', (user, message) => {
      console.log(`[${user}]: ${message}`);
    });
    
    // 连接管理
    async function connect() {
      try {
        await client.connect();
        console.log('Connected to SignalR Hub');
        
        // 调用服务端方法
        await client.invoke('SendMessage', 'uniAppUser', 'Hello from UniApp!');
        
        // 定时保持活跃
        setInterval(() => {
          if (client.socket.readyState === 1) {
            client.invoke('Ping');
          }
        }, 30000);
      } catch (error) {
        console.error('Connection error:', error);
      }
    }
    
    // 断开连接
    function disconnect() {
      client.close();
    }
    export default {
        onLaunch: function() {
            connect()
        },
        onUnload: () => {
            disconnect()
        },
        mounted: function() {
            console.log('App Show')
        },
        beforeDestroy: function() {
            console.log('App Hide')
        }
    }
</script>

<style>
    /*每个页面公共css */
    /* 深度穿透样式调整 */
    ::v-deep .uni-easyinput {
        /* 整体容器放大 */
        min-height: 90rpx !important;
    }

    /* 输入内容区域 */
    ::v-deep .uni-easyinput__content-input {
        height: 90rpx !important;
        min-height: 90rpx !important;
        font-size: 36rpx !important;
        /* 主字体大小 */
        line-height: 1.5 !important;
        /* 行高优化 */
        padding: 0 30rpx !important;
    }

    /* 占位符字体 */
    ::v-deep .uni-easyinput__placeholder-class {
        font-size: 34rpx !important;
        /* 占位符同步放大 */
        color: #999 !important;
    }

    /* 图标放大+位置修正 */
    ::v-deep .uni-easyinput__icon {
        width: 50rpx !important;
        height: 50rpx !important;

        &>uni-icons {
            font-size: 50rpx !important;
            /* 图标放大 */
        }

        margin-right: 25rpx !important;
        /* 图标间距 */
    }

    /* 聚焦状态加强 */
    ::v-deep .uni-easyinput--focus {
        .uni-easyinput__content {
            border-width: 2rpx !important;
            border-color: #007AFF !important;
        }

        .uni-easyinput__content-input {
            font-size: 38rpx !important;
            /* 聚焦时更大字体 */
        }
    }

    /* uni-data-select 组件样式 */
    ::v-deep .uni-data-select {
        min-height: 100rpx !important;
        /* 容器高度缩小 */
        border-radius: 16rpx !important;
    }

    /* 输入框主体 */
    ::v-deep .uni-select {
        height: 90rpx !important;
        /* 高度缩小适配移动端 */
        padding: 0 20rpx !important;
    }

    /* 文本内容 */
    ::v-deep .uni-select__input-text {
        font-size: 34rpx !important;
        /* 字体稍小于输入框 */
        padding-left: 10rpx !important;
    }

    /* 占位符 */
    ::v-deep .uni-select__input-placeholder {
        font-size: 34rpx !important;
        color: #999999 !important;
    }

    /* 下拉图标 */
    ::v-deep .uni-select__down {
        width: 40rpx !important;
        /* 图标适当缩小 */
        height: 40rpx !important;
    }

    /* 聚焦状态 */
    ::v-deep .uni-select--focus {
        border: 2rpx solid #007AFF !important;
        /* 保持与输入框一致的聚焦样式 */
    }

    /* 下拉弹窗调整 */
    ::v-deep .uni-select-menu {
        border-radius: 16rpx !important;
        box-shadow: 0 6rpx 30rpx rgba(0, 0, 0, 0.12) !important;
    }

    /* 下拉选项 */
    ::v-deep .uni-select-menu__item {
        height: 85rpx !important;
        line-height: 85rpx !important;
        font-size: 34rpx !important;
    }
</style>